<script type="text/html" template lay-done="layui.data.sendParams(d.params)">
    <div class="layui-card-body">
        <table class="layui-table" lay-even style="table-layout: fixed;">
            <tbody id="access_logs">
            <tr>
                <td class="set">路由</td>
                <td colspan="3" class="layui-elip">{{ d.params.data.path }}</td>
            </tr>
            <tr>
                <td class="set">IP地址</td>
                <td>{{ d.params.data.ip }}</td>
                <td class="set">请求方式</td>
                <td>{{ d.params.data.method }}</td>
            </tr>
            <tr>
                <td class="set">请求参数</td>
                <td colspan="3"><a class="layui-btn layui-btn-sm" lay-active="showInputCode"><i class="layui-icon layui-icon-code-circle"></i></a></td>
            </tr>
            <tr>
                <td class="set">Header</td>
                <td colspan="3" class="layui-elip"><a class="layui-btn layui-btn-sm" lay-active="showHeaderCode"><i class="layui-icon layui-icon-code-circle"></i></a></td>
            </tr>
            <tr>
                <td class="set">IP解析地址</td>
                <td>{{ d.params.data.ip_address }}</td>
                <td class="set">请求时间</td>
                <td>{{ d.params.data.created_at }}</td>
            </tr>
            <tr>
                <td class="set">操作系统</td>
                <td class="platform">{{ d.params.data.platform }}</td>
                <td class="set">浏览器</td>
                <td class="browser">{{ d.params.data.browser }}</td>
            </tr>
            </tbody>
        </table>
    </div>
</script>
<script>
    layui.data.sendParams = function(params){
        const fromData = params.data;
        layui.use(['index', 'baseMethods'], function (){
            const {$, layer, baseMethods, util} = layui;
            const openLayer = function (content) {
                layer.open({
                    type: 1,
                    title: false,
                    shadeClose: true,
                    maxWidth: 600,
                    maxHeight: 500,
                    content,
                    success() {
                        layui.code();
                    }
                })
            };
            let input_code_html = '', header_code_html = '';
            baseMethods.request({
                url: '/maintain/logs/access/' + fromData.id + '/show',
                done: function (result){
                    if (result.code === 200){
                        const data = result.data, obj = $('#access_logs');
                        obj.find('.platform').text(data.platform + ' ' + data.platformVersion);
                        obj.find('.browser').text(data.browser + ' ' + data.browserVersion);
                        input_code_html += '<pre class="layui-code" lay-options="{ln: false}">' + AppGeneral.formatJson(data.input) + '</pre>'
                        header_code_html += '<pre class="layui-code" lay-options="{ln: false}">' + AppGeneral.formatJson(data.header) + '</pre>'
                    }
                }
            });
            util.event('lay-active', {
                showInputCode: function (){
                    openLayer(input_code_html)
                },
                showHeaderCode: function (){
                    openLayer(header_code_html)
                }
            });
        });
    }
</script>
